<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://shiro.apache.org/tags" prefix="shiro" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>用户列表</title>
<script type="text/javascript" src="${ctx}/static/js/hp_list.js"></script>
</head>
<body>
	<form>
		<div class="demoTable">
			用户名：
			<div class="layui-inline">
				<input class="layui-input" name="userName" id="userName"
					autocomplete="off">
			</div>
			电话：
			<div class="layui-inline">
				<input class="layui-input" name="tel" id="tel"
					   autocomplete="off">
			</div>
			邮箱：
			<div class="layui-inline">
				<input class="layui-input" name="email" id="email"
					   autocomplete="off">
			</div>
			<button class="layui-btn bt_search" data-type="reload">搜索</button>
			<button type="reset" class="layui-btn layui-btn-primary">重置</button>
		</div>
	</form>
	<div style="height: 10px;" />
	<div>
			<button class="layui-btn bt_add" data="893px, 550px" data-url="${ctx}/user/toAddPage"><span class='iconfont icon-add'></span>&nbsp;新增</button>
			<button class="layui-btn layui-btn-warm bt_update" data="893px, 550px" data-url="${ctx}/user/toUpdatePage"><span class='iconfont icon-brush'></span>&nbsp;修改</button>
			<button class="layui-btn layui-btn-danger bt_delete" data-url="${ctx}/user/delete"><span class='iconfont icon-delete'></span>&nbsp;删除</button>
			<button class="layui-btn layui-btn-normal bt_setRole" data="893px, 550px" data-url="${ctx}/user/toSetRole"><span class='iconfont icon-group'></span>&nbsp;分配角色</button>
	</div>

	<table class="layui-hide" id="user" lay-data="{id: 'user'}"></table>
	<script>
		layui.use('table', function() {
			var table = layui.table;
			var util = layui.util;
			table.render({
				elem : '#user',
				url : '${ctx}/user/list',
				parseData:function (res){
					return {
						"code":0,
						"msg":res.message,
						"count":res.total,
						"data":res.records
					}
				},
				cellMinWidth : 80,
				page : true,
				cols : [ [ {
					type : 'checkbox'
				}, {
					field : 'id',
					width : 300,
					title : 'ID',
					sort : true
				}, {
					field : 'userName',
					title : '用户名'
				}, {
					field : 'nickname',
					title : '昵称'
				}, {
					field : 'tel',
					title : '电话'
				}, {
					field : 'sex',
					title : '性别',
					width : 60,
					templet : function (data){
						if (data.sex=='1') {
							return '男';
						}else {
							return '女';
						}
					}
				}, {
					field : 'email',
					title : '邮箱'
				}, {
					field : 'status',
					title : '状态',
					width : 60,
					templet : function (data){
						if (data.status=='on') {
							return '启用';
						}else {
							return '禁用';
						}
					}
				}, {
					field : 'userImg',
					title : '头像'
				}, {
					field : 'createTime',
					title : '创建时间',
					width: 140,
					templet: function(res){
						if(res.createTime !=null){
							console.log(res.createTime);
							return util.toDateString(res.createTime, "yyyy-MM-dd HH:mm:ss");
						}else{
							console.log(res.createTime);
							return "";
						}
					}


				}, {
					field : 'updateTime',
					title : '更新时间',
					width: 140,
					templet: function(res){
						if(res.updateTime !=null){
							return util.toDateString(res.updateTime, "yyyy-MM-dd HH:mm:ss");
						}else{
							return "";
						}
					}
				} ] ],
				data: [
					{"id":"1026027802194242a4adb367b2780e46","userName":"tom","nickname":"石头","tel":"13717594450","sex":"男",
						"email":"2873444@qq.com","status":"on","userImg":"","createTime":"2019-01-17 12:48:46","updateTime":""},
					{"id":"1026027802194242a4adb367b2780e41","userName":"tom","nickname":"石头2","tel":"13717594450","sex":"男",
						"email":"2873444@qq.com","status":"on","userImg":"","createTime":"2019-01-17 12:48:46","updateTime":""},
					{"id":"1026027802194242a4adb367b2780e3","userName":"tom","nickname":"石头3","tel":"13717594450","sex":"男",
						"email":"2873444@qq.com","status":"启用","userImg":"","createTime":"2019-01-17 12:48:46","updateTime":""},
					{"id":"1026027802194242a4adb367b2780e43","userName":"tom","nickname":"石头4","tel":"13717594450","sex":"男",
						"email":"2873444@qq.com","status":"启用","userImg":"","createTime":"2019-01-17 12:48:46","updateTime":""}
				]

			});

			//搜索条件
			//搜索条件
			let active = {
				reload : function() {
					table.reload($('table').attr("id"), {
						where : {
							userName : $('#userName').val(),
							tel : $('#tel').val(),
							email : $('#email').val()
						}
					});
				}
			};


			//触发搜索条件事件
			$('.bt_search').on('click', function (e){
				var type = $(this).data('type');
				active[type] ? active[type].call(this) : '';
				return false;
			})
			//关闭
			$('.bt_close').on('click', function() {
				parent.layer.closeAll();
			});

			//提交
			$('.bt_setRole').on('click', function() {
				let checkStatus = layui.table.checkStatus($('table').attr("id"));
				$.ajax({
					type: "POST",
					url: '${ctx}/user/setRole?id='+$('#id').val(),
					contentType : "application/json",
					dataType: 'json',
					data: JSON.stringify(checkStatus.data),
					success: function(data){
						if (data.result==true) {
							parent.layer.msg(data.msg, {icon: 1, time: 1500});
							let index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
							parent.layer.close(index); //再执行关闭
						}else {
							layer.msg(data.msg, {icon: 2, time: 1500});
						}
					},
					error: function(res){
						layer.msg("未知异常", {icon: 2});
					}
				});
			});

		});
	</script>
</body>
</html>
